<template>
	<scroll-view scroll-y class="help-detail">
		<view class="title">{{ detailInfo.title }}</view>
		<view class="content-box">
			<rich-text class="content" :nodes="detailInfo.contents || ''"></rich-text>
		</view>
		<Loading ref="loading"></Loading>
	</scroll-view>
</template>

<script>
	import Loading from '@/components/loding.vue'
	import { request } from '@/utils/request.js'
	import { richTextImg } from '@/utils/utils.js'
	export default {
		data() {
			return {
				detailInfo: {}
			}
		},
		components: {
			Loading
		},
		methods: {

		},
		onLoad(option) {
			this.$refs.loading.init()
			this.$refs.loading.progress = 100
			// setTimeout(() => {
			// 	this.$refs.loading.destoryed()
			// }, 1000)
			uni.setNavigationBarTitle({
				title: option.title
			})
			request('/api/hlx-article/detail', {
				id: option.id
			}, 'get').then(res => {
				this.$refs.loading.destoryed()
				if (res.data.code === 200) {
					const detailInfo = res.data.data
					detailInfo.contents = detailInfo.contents ? richTextImg(detailInfo.contents) : ''
					this.detailInfo = detailInfo
				}
			})
		}
	}
</script>

<style lang="less" scoped>
	.help-detail {
		height: 100vh;
		padding: 34rpx;
		.title {
			width: 680rpx;
			font-size: 32rpx;
			font-family: Source Han Sans CN, Source Han Sans CN;
			font-weight: 500;
			color: #333333;
			line-height: 38rpx;
			margin-bottom: 20rpx;
		}
		.content-box {
			width: 680rpx;
			padding: 28rpx 40rpx;
			background: #FAFAFA;
			border-radius: 26rpx 26rpx 26rpx 26rpx;
			margin-bottom: 30rpx;
			.content {
				font-size: 28rpx;
				font-family: Source Han Sans CN, Source Han Sans CN;
				font-weight: 400;
				color: #000000;
				line-height: 48rpx;
			}
		}
	}

</style>